<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Student page</title>
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link href="../../project/css/bootstrap.css" rel="stylesheet" media="screen">
                     <link href="../../project/css/stylish-portfolio.css" rel="stylesheet" media="screen">
    <link href="css/mystyle.css" rel="stylesheet" media="screen">
    <!-- Add custom CSS here -->
    <!--
    Цель: Создать окно для студента
-->
</head>
<style>
    body {
        padding-top: 70px;
    }
</style>
<body>
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container-fluid">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <div class="navbar-header">
                    <a class="navbar-brand" href="#">
                        <img alt="Brand" src="img/icon.png" style="width: 32px;height: 32px"> Страница Студента
                    </a>
                </div>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#"><img src="img/person.png"
                       style="width: 32px;height: 32px;margin-right: 8px;margin-top: -8px">Username</a>
                   </li>
                   <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">More
                        <span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#">Settings</a></li>
                            <li><a href="#">Help</a></li>
                            <li><a href="#">Contacts</a></li>
                            <li class="divider"></li>
                            <li><a href="#">Log Out</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>

    </nav>
    <select class="form-control" name="game_type" id="select_game_types">
        <option selected value="Simple">Simple</option>
        <option value="True-false">True-false</option>
        <option value="Input">Input</option>
        <option value="Pole chudes">Pole chudes</option>
        <option value="Match">Match</option>
    </select>
    <button id="next">Next</button>
    <button id="prev">Nazad</button>
</body>
<script src="js/jquery-1.10.2.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="../../project/js/jquery-ui.js"></script>
<script type="text/javascript">
    h="";
    limit=[1,2,23,4,5,6,7,8,9];
    limitArray();
    function limitArray(){
        console.log(limit.slice(0,4));
    }
    fd=['Simple','True-false','Input','Pole chudes','Match'];
    index=0;
    $("#next").click(function(){
        index++;
        $("#select_game_types option").removeAttr("selected");
        $("#select_game_types option[value='"+fd[index]+"']").attr("selected",'selected');
    });
    $("#select_game_types").change(function(){
        var sele=$(this).find("option:selected");
        var getValue=sele.val();
        var text=sele.text();
        alert(getValue+"///"+text);
    });
</script>
</html>